<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Wemoney - Dashboard</title>
    <!-- font awesome icons -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css"
        integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g=="
        crossorigin="anonymous" referrerpolicy="no-referrer" />
    <link rel="stylesheet" href="{{ url_for('static', filename='font/bootstrap-icons.css') }}">
    <!-- bootstrap -->
    <link rel="stylesheet" href="{{ url_for('static', filename='bootstrap-5.1.3-dist/css/bootstrap.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">

    <style>
        th{
            vertical-align: middle;
            text-align: center;
        }

        tr th:first-child {
             width: 20px;
        }

        tr th:last-child {
             width: 100px;
        }

        .form-check{
            width: 20px;
        }
    </style>
</head>

<body>
    <div class="dashboard-pg text-grey-blue">
        <nav class="navigation-bar d-flex align-items-center">
            <div class="container">
                <div class="row align-items-center">
                    <div class="navigation-bar-left col-4 d-flex align-items-center">
                        <button type="button" class="navbar-open-btn text-grey-blue me-3">
                            <i class="bi bi-list h3"></i>
                        </button>
                        <!-- <div class="navbar-logo">
                            <img src="assets/images/logo.png" alt="site logo">
                        </div> -->
                    </div>
                    <div class="col-4 h3 text-center ">图书管理系统</div>
                    <div class="navigation-bar-right col-4 d-flex align-items-center justify-content-end">
                        <span class="col-2">{{session['nick_name']}}</span>
                        <a href="#" id="user" class="profile-btn bg-blue text-white btn-circle ms-1">
                            <i class="bi bi-person-fill fs-20"></i>
                        </a>
                        <!-- <button type="button" class="notification-btn text-grey-blue">
                            <i class="fa-regular fa-bell"></i>
                        </button> -->
                    </div>
                </div>
            </div>
        </nav>

        <div class="navigation-overlay position-fixed"></div>

        <div class="navigation-sidebar bg-light-grey">
            <div class="navbar-sb-head d-flex justify-content-between align-items-center px-4">
                <!-- <img src="assets/images/logo.png"> -->
                <span>{{session['nick_name']}}</span>
                <button class="navbar-close-btn text-grey-blue">
                    <i class="bi bi-arrow-left"></i>
                </button>
            </div>

            <div class="navbar-sb-list p-4">
                <div class="navbar-sb-item mb-5">
                    <h5 class="text-uppercase text-grey navbar-sb-item-title fs-12 ls-1">功能区</h5>
                    <ul class="navbar-sb-links p-0 list-unstyled">
                        <li class="navbar-sb-link my-3">
                            <a href="{{ url_for('book_manage.books_getall') }}" class="text-decoration-none d-flex align-items-center justify-content-between">
                                <div class="text-light-blue d-flex align-items-center">
                                    <span class="navbar-sb-icon me-3">
                                        <i class="bi bi-book"></i>
                                    </span>
                                    <span class="navbar-sb-text fs-14 fw-5 text-capitalize">查看图书</span>
                                </div>
                                <!-- <span class="badge text-uppercase text-blue">hot</span> -->
                            </a>
                        </li>
                       
                        <li class="navbar-sb-link my-3">
                            <a href="{{url_for('usr.my_borrow')}}" class="text-decoration-none d-flex align-items-center justify-content-between">
                                <div class="text-light-blue d-flex align-items-center">
                                    <span class="navbar-sb-icon me-3">
                                        <i class="bi bi-list-ul"></i>
                                    </span>
                                    <span class="navbar-sb-text fs-14 fw-5 text-capitalize">我的借阅</span>
                                </div>
                                <!-- <span class="badge text-uppercase text-blue">new</span> -->
                            </a>
                        </li>

                        <li class="navbar-sb-link my-3">
                            <a href="{{ url_for('usr.center') }}" class="text-decoration-none d-flex align-items-center justify-content-between">
                                <div class="text-light-blue d-flex align-items-center">
                                    <span class="navbar-sb-icon me-3">
                                        <i class="bi bi-person"></i>
                                    </span>
                                    <span class="navbar-sb-text fs-14 fw-5 text-capitalize">个人中心</span>
                                </div>
                                <!-- <span class="badge text-uppercase text-blue">new</span> -->
                            </a>
                        </li>

                    </ul>
                </div>

                


                <div class="navbar-sb-item mb-5">
                    <h5 class="text-uppercase text-grey navbar-sb-item-title fs-12 ls-1">用户操作</h5>
                    <ul class="navbar-sb-links p-0 list-unstyled">
                        <li class="navbar-sb-link my-3">
                            <a href="#" class="text-decoration-none d-flex align-items-center justify-content-between">
                                <div class="text-light-blue d-flex align-items-center">
                                    <span class="navbar-sb-icon me-3">
                                        <i class="fas fa-lock"></i>
                                    </span>
                                    <span class="navbar-sb-text fs-14 fw-5 text-capitalize"><a href="{{url_for('auth.logout')}}" style="display:block;width:100%;height:100%;text-decoration:none;">logout</a></span>
                                </div>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>

        <div class="dashboard-main">
            <div class="container">
                <div class="row pt-3">
                    <div class="col-12">
                        <h4 class="col-12 bg-light-grey py-2">借阅记录</h4>
                    </div>
                </div>

                <!-- 查询记录 -->
<!--                <form action="" method="post">-->
<!--                    <div class="row mb-3">-->
<!--                        <div class="col-3">-->
<!--                            <input type="text" class="form-control col-3" name="bookname" id="bookname"-->
<!--                                placeholder="请输入书籍名称">-->
<!--                        </div>-->
<!--                        <div class="col-3">-->
<!--                            <input type="text" class="form-control col-3" name="ISBN" id="ISBN"-->
<!--                                placeholder="请输入ISBN号">-->
<!--                        </div>-->
<!--                        <div class="col-2">-->
<!--                            <input type="datetime-local" class="form-control col-3" name="datatime" id="datatime"-->
<!--                                placeholder="请输入时间">-->
<!--                        </div>-->
<!--                        <div class="col-4">-->
<!--                            <button class="btn btn-primary mr-2"><i class="bi bi-search"></i>查询</button>-->
<!--                            <button type="reset" class="btn btn-danger"><i class="bi bi-x"></i></i>清除条件</button>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                </form>-->
                <!-- 结束查询 -->

                <form action="">
                    <div class=" border" style="height: 500px;">

                        <table class="table table-striped table-hover table-bordered">
                            <thead>
                                <tr>
                                    <th class="col-1">
                                        <div class="form-check">
                                            <input class="form-check-input" type="checkbox" value="" id="full">
                                        </div>
                                    </th>
                                    <th>书名</th>
                                    <th>ISBN号</th>
                                    <th>作者</th>
                                    <th>出版社</th>
                                    <th>时间</th>
                                    <th>状态</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                            {% for x in myborrow: %}
                                <tr>
                                    <th>
                                        <div class="form-check">
                                            <input class="form-check-input" type="checkbox" value="" id="full">
                                        </div>
                                    </th>
                                    <th>{{x.bookname}}</th>
                                    <th>{{x.bookisbn}}</th>
                                    <th>{{x.author}}</th>
                                    <th>{{x.printname}}</th>
                                    <th>{{time[x.bookisbn]}}</th>
                                    {% if isback[x.bookisbn] == 1%}
                                    <th style="color:green;">归还</th>
                                    {% elif (now-time[x.bookisbn]).seconds > 432000: %}
                                    <th style="color:red;">超时</th>
                                    {% else: %}
                                    <th>借阅中</th>
                                    {% endif %}
                                    {% if isback[x.bookisbn] == 1%}
                                    <th><button class="btn btn-primary disabled">已归还</button></th>
                                    {% else: %}
                                    <form action="{{url_for('usr.give_back', iid=session['user_id'], isbn=x.bookisbn)}}"></form>
                                    <form action="{{url_for('usr.give_back', iid=session['user_id'], isbn=x.bookisbn)}}" method="post">
                                    <th><button class="btn btn-primary">归还</button></th>
                                    </form>
                                    {% endif %}
                                </tr>
                            {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </form>
                <form action="{{ url_for('usr.jump_page')}}" method="post">
                    <div class="container mt-3 align-items-center"  >
                        <div class="row ">
                            <div class="col-4" style="padding-top: 8px;"> 显示第{{ (nowpage-1)*10+1 }}条到第{{nowpage*10}}条记录，总共<b>{{ session['myborrownum'] }}</b>条记录&nbsp;</div>
                            <ul class="pagination col-5  justify-content-end">
                                {% if nowpage ==  1: %}
                                <li class="page-item disabled"><a class="page-link" href="{{url_for('usr.turn_page',page=nowpage-1)}}"><i class="bi bi-chevron-left"></i></a></li>
                                {% else: %}
                                <li class="page-item"><a class="page-link" href="{{url_for('usr.turn_page',page=nowpage-1)}}"><i class="bi bi-chevron-left"></i></a></li>
                                {% endif %}
                                {% for page in range(1, session['myborrowpages']+1): %}
                                <li class="page-item"><a class="page-link" href="{{url_for('usr.turn_page',page=page)}}">{{ page }}</a></li>
                                {% endfor %}
                                {% if nowpage ==  session['myborrowpages']: %}
                                <li class="page-item disabled" ><a class="page-link" href="{{url_for('usr.turn_page',page=nowpage+1)}}"><i class="bi bi-chevron-right"></i></a></li>
                                {% else: %}
                                <li class="page-item" ><a class="page-link" href="{{url_for('usr.turn_page',page=nowpage+1)}}"><i class="bi bi-chevron-right"></i></a></li>
                                {% endif %}
                            </ul>
                            <div class="col-3">
                                <div class="input-group">
                                    <span style="padding-top: 8px;" >跳转到</span>
                                    <input type="number"  class="form-control" max="{{ session['myborrowpages'] }}" min="1" name="page" id="page" value=1>
                                    <span style="padding-top: 8px;">页</span>
                                    <button class="btn btn-primary ms-1">确定</button>
                                </div>
                             </div>

                        </div>

                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- jquery -->

    <script src="{{ url_for('static', filename='js/jQuery.js') }}"></script>
    <script src="{{ url_for('static', filename='js/script.js') }}"></script>
    <script src="{{ url_for('static', filename='bootstrap-5.1.3-dist/js/bootstrap.js') }}"></script>

</body>

</html>